<script setup lang="ts">
import { GetGroupAPI, GetUserSettingAPI, UpdateUserSettingAPI } from '@/services/detail'
import { GetVersionAPI, SearchFileAPI, SearchFileOneAPI } from '@/services/img'
import { useMemberStore } from '@/stores'
import type { UserSetting } from '@/types/detail'
import { onLoad, onShow } from '@dcloudio/uni-app'
import { computed, ref } from 'vue'
// 获取屏幕边界到安全区域距离
const { safeAreaInsets } = uni.getSystemInfoSync()
// 订单选项
const orderTypes = [
  { type: '1', text: '消息', icon: 'icon-check' },
  { type: '2', text: '预算中心', icon: 'icon-check' },
  { type: '3', text: '定时记账', icon: 'icon-check' },
  { type: '4', text: '存钱打卡', icon: 'icon-check' },
]
// 获取会员信息http://129.211.29.188:8080/Uploads/A24B1DC1-DE39-4583-8976-A9AD078F693A.jpeg
const memberStore = useMemberStore()
const imgPath = ref('')
const backgroundImgMain = ref('')
const opacity = ref(0.7)
const version = ref('')
const userSetting = ref<UserSetting>({
  UserName: '',
  IsAmount: false,
  IsSearchSelf: false,
  DefaultAccountNo: '',
  DefaultOutAccountNo: '',
  DefaultInAccountNo: '',
  DefaultNoteAccountNo: '',
  MyOpacit: 0,
  DetailOpacit: 0,
  CountOpacit: 0,
  NoteAccoutOpacit: 0,
  ZichanOpacit: 0,
  TagSelf: '',
  SoftStyle: '',
})
const tagEdit = ref(false)
const logout = () => {
  memberStore.clearProfile()
  uni.showToast({ icon: 'success', title: '退出成功' })
}
const changeImg = (UserName: string) => {
  uni.navigateTo({ url: '/pages/my/fileUpload?ImgType=LoginImg&UserName=' + UserName })
}
//加载初始化
onLoad(async () => {
  const res1 = await GetVersionAPI({
    Auth: '',
  })
  version.value = res1.result.Version
  await UpdateCookie()
})
//更新cookie
const UpdateCookie = async () => {
  if (memberStore.profile) {
    const res = await GetGroupAPI({
      UserName: memberStore.profile.UserName,
      Auth: memberStore.profile.Token,
    })
    memberStore.setProfile(res.result)
  }
}
onShow(async () => {
  if (memberStore.profile) {
    // const res1 = await GetVersionAPI({
    //   Auth: '',
    // })
    // if (version.value != res1.result.Version) {
    //   window.location.reload()
    // }
    const res = await SearchFileOneAPI({
      ImgType: 'LoginImg',
      UserName: memberStore.profile.UserName,
      ID: 0,
    })
    if (res.result) {
      imgPath.value = res.result.ImgUrl
    } else {
      imgPath.value = '@/static/images/login.png'
    }
    //个性主题
    const my = await SearchFileOneAPI({
      ImgType: 'my',
      UserName: memberStore.profile.UserName,
      ID: 0,
    })
    if (my.result) {
      backgroundImgMain.value = my.result.ImgUrl
    }
    const setting = await GetUserSettingAPI({
      UserName: memberStore.profile.UserName,
    })
    opacity.value = setting.result.MyOpacit / 10
    userSetting.value = setting.result
  }
})
const OnTag = async (edit: any) => {
  tagEdit.value = edit
  if (!edit) {
    await UpdateUserSettingAPI(userSetting.value)
  }
}
tagEdit
</script>

<style lang="scss">
@import './styles/my.scss';
</style>

<template>
  <scroll-view enable-back-to-top class="viewport" scroll-y>
    <view
      class="viewport1"
      :style="`background: url('${backgroundImgMain}')  no-repeat center / cover;opacity: ${opacity}`"
    ></view>
    <!-- 个人资料 -->
    <view class="profile" :style="{ paddingTop: safeAreaInsets!.top + 'px' }">
      <!-- 情况1：已登录 -->
      <view class="overview" v-if="memberStore.profile">
        <navigator hover-class="none">
          <image
            class="avatar"
            :src="imgPath"
            mode="aspectFill"
            @click="changeImg(memberStore.profile.UserName)"
          ></image>
        </navigator>
        <view class="meta">
          <view class="nickname">
            {{ memberStore.profile.UserName }}
          </view>
        </view>
        <view class="tag">
          <text @tap="OnTag(true)" v-if="!tagEdit">{{ userSetting.TagSelf }}</text>
          <input
            @blur="OnTag(false)"
            v-if="tagEdit"
            class="uni-input"
            focus
            v-model="userSetting.TagSelf"
          />
        </view>
      </view>
      <!-- 情况2：未登录 -->
      <view class="overview" v-else>
        <navigator url="/pages/login/login" hover-class="none">
          <image class="avatar gray" mode="aspectFill" src="@/static/images/touxiang.png"></image>
        </navigator>
        <view class="meta">
          <navigator url="/pages/login/login" hover-class="none" class="nickname">
            未登录
          </navigator>
          <view class="extra"> </view>
        </view>
      </view>
    </view>
    <!-- 账本 :style="`background: url('${backgroundImgMain}')  no-repeat center / cover`" -->
    <view class="acccount">
      <navigator
        class="icon-currency navigator"
        url="/pages/count/monthCount"
        hover-class="none"
        v-if="userSetting?.SoftStyle != '简约'"
      >
        <text class="content">月账单</text> <text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="/pages/NoteAcount/MyTask" hover-class="none">
        <text class="content">我们的任务</text><text class="icon-right"></text>
      </navigator>
      <navigator
        class="icon-currency navigator"
        url="/pages/NoteAcount/NoteLogMain"
        hover-class="none"
      >
        <text class="content">随心记</text><text class="icon-right"></text>
      </navigator>
      <navigator
        class="icon-currency navigator"
        url="/pages/plan/savemoney"
        hover-class="none"
        v-if="userSetting?.SoftStyle != '简约'"
      >
        <text class="content">存钱打卡</text> <text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="/pages/NoteAcount/DaKa" hover-class="none">
        <text class="content">自律打卡</text><text class="icon-right"></text>
      </navigator>

      <navigator class="icon-currency navigator" url="/pages/Job/Job" hover-class="none">
        <text class="content">定时记账</text><text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="/pages/NoteAcount/Notice" hover-class="none">
        <text class="content">发布通告</text><text class="icon-right"></text>
      </navigator>
      <!-- <navigator class="icon-currency navigator" url="#" hover-class="none">
        <text class="content">每日随记</text><text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="#" hover-class="none">
        <text class="content">类别设置</text> <text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="#" hover-class="none">
        <text class="content">标签设置</text> <text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="#" hover-class="none">
        <text class="content">收支账户</text> <text class="icon-right"></text>
      </navigator> -->
      <navigator
        class="icon-currency navigator"
        url="/pages/NoteAcount/usergroup"
        hover-class="none"
      >
        <text class="content">群组管理</text><text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="/pages/my/theme" hover-class="none">
        <text class="content">个性主题</text><text class="icon-right"></text>
      </navigator>
      <navigator
        class="icon-currency navigator"
        url="/pages/NoteAcount/GoodType?inout=1"
        hover-class="none"
      >
        <text class="content">商品类别</text><text class="icon-right"></text>
      </navigator>
      <navigator
        class="icon-currency navigator"
        url="/pages/NoteAcount/TagSetting?inout=1"
        hover-class="none"
      >
        <text class="content">商品标签</text><text class="icon-right"></text>
      </navigator>
      <navigator class="icon-currency navigator" url="/pages/my/setting" hover-class="none">
        <text class="content">基础设置</text><text class="icon-right"></text>
      </navigator>
      <view class="icon-currency navigator" @tap="logout">
        <text class="content">退出登录</text> <text class="icon-right"></text>
      </view>
      <navigator
        class="icon-currency navigator"
        url="/pages/NoteAcount/NoteLog?ID=-1"
        hover-class="none"
      >
        <text class="content">{{ '连太记账' + version }}</text> <text class="icon-right"></text>
      </navigator>
      <uni-link
        class="icon-currency navigator"
        href="https://beian.miit.gov.cn/"
        text="粤ICP备2024270636号-2"
      ></uni-link>
    </view>
  </scroll-view>
</template>
